<template>
  <div class="iframe-container">
    <iframe id="iframeId" :src="src" frameborder="0" class="pc iframe" scrolling="auto"></iframe>
  </div>
</template>

<script>
  export default {
    name: "stuIframe",
    data() {
      return {
        src: '',
      }
    },
    created() {
      let iframe = this.$route.query.url;
      let split = iframe.split(":");
      this.src = split[1];
    },
    methods: {},
    mounted() {
      function changeFrameHeight() {
        const oIframe = document.getElementById('iframeId');
        const deviceWidth = document.documentElement.clientWidth;
        const deviceHeight = document.documentElement.clientHeight;
        oIframe.style.width = (Number(deviceWidth) - 220) + 'px';
        oIframe.style.height = (Number(deviceHeight) - 125) + 'px';
      }

      changeFrameHeight()
    },
  }
</script>

<style scoped>
  .iframe-container {
    text-align: center;
    overflow-x: hidden;
    overflow-y: hidden;
  }

  .iframe-container .iframe {
    width: 100%;
    height: 100%;
  }
</style>
